<template>
  <a-spin :spinning="confirmLoading">
    <j-form-container :disabled="false">
      <a-form-model ref="form" :model="model" :rules="validatorRules" slot="detail">
        <a-row :gutter="48">
          <a-col :span="12">
            <a-form-model-item label="冲账借款单据" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="relBillId">
              <select-finance-loan-bill-input  :disabled="formDisabled  || !applicant || showFlowSubmitButton" v-model="model.relBillId" :applicant="applicant"  @back="relBillData" placeholder="请选择关联单据单号" />
            </a-form-model-item>
          </a-col>
          <template v-if="this.relBillType=='1'" >
          <a-col :span="12">
            <a-form-model-item label="借款金额(元)" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="borrowLoanAmount">
              <a-input-number :max="99999999" :min="0" v-model="model.borrowLoanAmount" placeholder="请输入借款金额" style="width: 100%" disabled/>
            </a-form-model-item>
          </a-col>
          <a-col :span="12">
            <a-form-model-item label="已还金额(元)" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="borrowOnloanAmount">
              <a-input-number :min="0"  v-model="model.borrowOnloanAmount" placeholder="请输入已还金额" style="width: 100%" disabled/>
            </a-form-model-item>
          </a-col>
        </template>
        <template v-if="this.relBillType=='2'" >
          <a-col :span="12">
            <a-form-model-item label="预付款金额(元)" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="payPayableAmount">
              <a-input-number :max="99999999" :min="0" v-model="model.payPayableAmount" placeholder="请输入预付款金额" style="width: 100%" disabled/>
            </a-form-model-item>
          </a-col>
          <a-col :span="12">
            <a-form-model-item label="已冲账金额(元)" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="payOnChargedAmount">
              <a-input-number :min="0"  v-model="model.payOnChargedAmount" placeholder="请输入已冲账金额" style="width: 100%" disabled/>
            </a-form-model-item>
          </a-col>
        </template>
          <a-col :span="12">
            <a-form-model-item label="本次冲账金额(元)" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="chargedAmount">
              <a-input-number :disabled="formDisabled" :max="99999999" :min="0" v-model="model.chargedAmount" placeholder="请输入本次冲账金额" style="width: 100%" @change="inputChargedAmount" />
            </a-form-model-item>
          </a-col>
          <a-col :span="12">
            <a-form-model-item label="剩余未冲账金额(元)" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="unChargedAmount">
              <a-input-number v-model="model.unChargedAmount" placeholder="请输入剩余未冲账金额" style="width: 100%" disabled/>
            </a-form-model-item>
          </a-col>
        </a-row>
      </a-form-model>
    </j-form-container>
  </a-spin>
</template>

<script>

  import { getAction } from '@/api/manage'
  import SelectProjectTaskInput from '@/views/scy/components/SelectProjectTaskInput'
  import SelectProjectInput from '@/views/scy/components/SelectProjectInput'
  import SelectTeamInput from '@/views/scy/components/SelectTeamInput'
  import JDictSelectCategory from '@/components/dict/JDictSelectCategory.vue'
  import SelectFinanceLoanBillInput from '@/views/scy/components/SelectFinanceLoanBillInput'

  export default {
    name: 'ErpFinanceReimbursementSalaryFeeForm',
    components: {
      SelectProjectTaskInput,
      SelectProjectInput,
      SelectTeamInput,
      JDictSelectCategory,
      SelectFinanceLoanBillInput
    },
    props: {
      showFlowSubmitButton: {
        type: Boolean,
        default: false,
        required: false
      },
      //表单禁用
      disabled: {
        type: Boolean,
        default: false,
        required: false
      },
      // teamId: {
      //   type: String,
      //   default: null
      // },
      applicant: {
        type: String,
        default: null
      },
      relBillType:{
        type: String,
        default: null
      }
    },
    data () {
      return {
        dataSource:[],
        contentFlag:false,
        isSpecialDisabled:false,
        model:{
        },
        labelCol: {
        },
        wrapperCol: {
          xs: { span: 24 },
          sm: { span: 24 },
        },
        confirmLoading: false,
        validatorRules: {
          relBillId:[ { required: true, message: '请选择关联的冲账单据!'},],
          chargedAmount:[ { required: true,pattern: /^(([1-9][0-9]*)|([0]\.\d{0,2}|[1-9][0-9]*\.\d{0,2}))$/, message: '请输入正确的金额!'},],
          unChargedAmount:[ { required: false,pattern: /^(([1-9][0-9]*)|([0]\.\d{0,2}|[1-9][0-9]*\.\d{0,2}))$/, message: '剩余未冲账金额不正确!'},],
        },
        url: {
          add: "/api/erp/finance/reimbursement/erpFinanceReimbursementDailyFeeInfo/add",
          edit: "/api/erp/finance/reimbursement/erpFinanceReimbursementDailyFeeInfo/edit",
          queryById: "/api/erp/finance/reimbursement/erpFinanceReimbursementDailyFeeInfo/queryById"
        }
      }
    },
    computed: {
      formDisabled(){
        return this.disabled
      },
    },
    created () {
       //备份model原始值
      this.modelDefault = JSON.parse(JSON.stringify(this.model));
    },
    methods: {
      //输入报销金额
      inputAmount(){
        // taxation 税费金额=0
        if(!this.model.taxation){
          this.$set(this.model, 'taxation',0);
        }
        if(this.model.amount && (this.model.taxation || this.model.taxation==0)){
          // 未税金额 = 报销金额 - 税费金额 
          this.model.untaxedAmount=(this.model.amount-this.model.taxation).toFixed(2);
        }
      },
      changeTask(data){
        if(data){
            this.model.taskName=data[0].taskDescription
        }
      },
      selectProject(data){
        if(data){
          this.model.performanceAttributionYear=data.choseObj[0].year;
          // this.model.teamId=data.choseObj[0].teamName;
          if(this.model.taskCategory){
            this.$set(this.model,"taskName",null);
            this.$set(this.model,"taskCategory",'');
          }
        }
      },
      add () {
        this.edit(this.modelDefault);
      },
      edit (record) {
        this.$refs['form'].clearValidate();
        Object.assign(this.$data, this.$options.data())
        this.model = Object.assign({}, record);
        this.visible = true;
      },
      submitForm () {
        const that = this;
        // 触发表单验证
        this.$refs.form.validate(valid => {
          if (valid) {
            console.log(this.dataSource);
            if(this.dataSource.length>0){
              let validRes=this.dataSource.filter(item=>item.relBillId==this.model.relBillId && item.id!=this.model.id);
              console.log(validRes);
              if(validRes.length>0){
                this.$message.warning("该冲账单据已经存在，请勿重复选择！")
                return false;
              }
            }
            if (!this.model.id) {
              this.model.id = parseInt(Math.random() * 1000000000000);
            }
            that.$emit('ok',this.model);
          }

        })
      },
      relBillData(data){
        console.log(data);
        let id=this.model.relBillId;
        if(this.relBillType=="1"){//借款单
          getAction("/api/erp/finance/borrow/erpFinanceLoanBill/queryById",{'id':id}).then((res) => {
            if (res.success) {
                console.log(res);
                let data=res.result;
                let loanAmount=data.amount;//借款金额
                let onloanAmount=data.repaymentAmount+data.travelReimbursementAmount+data.expenseReimbursementAmount;//已还金额
                this.$set(this.model,'borrowLoanAmount',loanAmount);
                this.$set(this.model,'borrowOnloanAmount',onloanAmount);
                this.inputChargedAmount(this.model.chargedAmount)
            }
          })
         }else if(this.relBillType=="2"){//付款单
          getAction("/api/erp/finance/payment/erpFinancePaymentSlipFeeDetail/queryBillInfoByBillId",{'billId':id}).then((res) => {
            if (res.success) {
                let resResult=res.result.records[0];
                let payPayableAmount=resResult.currentPaidAmount;//应付金额
                let onChargedAmount=resResult.onChargedAmount;//冲账金额
                this.$set(this.model,'payOnChargedAmount',onChargedAmount);
                this.$set(this.model,'payPayableAmount',payPayableAmount);
                this.inputChargedAmount(this.model.chargedAmount)
            }
          })
        }
      },
      inputChargedAmount(data){
        let unChargedAmount=0;
        if(this.relBillType=="1"){//借款单
          let borrowLoanAmount=this.model.borrowLoanAmount;
          let borrowOnloanAmount=this.model.borrowOnloanAmount;
          unChargedAmount=(borrowLoanAmount.toFixed(2)-borrowOnloanAmount.toFixed(2)-data.toFixed(2)).toFixed(2);
        }else if(this.relBillType=="2"){//付款单
          let payPayableAmount=this.model.payPayableAmount;
          let payOnChargedAmount=this.model.payOnChargedAmount;
          unChargedAmount=(payPayableAmount.toFixed(2)-payOnChargedAmount.toFixed(2)-data.toFixed(2)).toFixed(2);
        }
        this.$set(this.model,'unChargedAmount',unChargedAmount);
      }
    }
  
  }
</script>